<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="//res.layui.com/layui/dist/css/layui.css?t=1525771196163" media="all">
<link rel="stylesheet" type="text/css" href="${proPath }/js/md/editormd.min.css" />
<link href="https://cdn.bootcss.com/sco.js/1.1.0/css/sco.message.min.css" rel="stylesheet">

<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdn.bootcss.com/jquery.form/4.2.2/jquery.form.min.js"></script>
<script src="${proPath }/js/boots/js/holder.min.js"></script>
<script src="${proPath }/js/md/editormd.js" type="text/javascript" charset="utf-8"></script>
<script src="https://cdn.bootcss.com/sco.js/1.1.0/js/sco.message.min.js"></script>
</head>

<body>
	<div class="container">
		<form id="formBlog" action="${proPath }/blog/getWrite" method="post">
			<input id="blog_title" name="title" value="" style="display: none;"></input>
			<textarea id="blog_md" name="md" value="" style="display: none;"></textarea>
			<textarea id="blog_html" name="html" value="" style="display: none;"></textarea>
		</form>
		<div class="row">
			<div class="panel panel-primary">
				<div class="page-header">
					<div class="panel-heading">
						<div class="row">
							<div class="col-md-8 col-md-offset-2 col-sm-3">
								<input type="text" class="form-control" id="art-head" name="art-head" placeholder="标题">
							</div>
							<div class="col-md-2 col-sm-1">
								<button class="btn btn-success btn-blog-save">发布内容</button>
							</div>
						</div>
					</div>
				</div>
				<div class="panel-body">
					<div class="row">
						<div id="blog_mdedit"></div>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript">
	$(function() {
		md_edit = editormd("blog_mdedit", { //注意1：这里的就是上面的DIV的id属性值
			placeholder : '  META-INF/resources|欢迎使用|测试图片上传',
			width : "90%",
			height : 448,
			syncScrolling : "single",
			emoji : true,
			path : "${proPath }/js/md/lib/", //注意2：你的路径
			saveHTMLToTextarea : true,
			tocm : true, // Using [TOCM]
			tex : true, // 开启科学公式TeX语言支持，默认关闭
			flowChart : true, // 开启流程图支持，默认关闭
			/* 上传图片配置 */
			imageUpload : true,
			imageFormats : [ "jpg", "jpeg", "gif", "png", "bmp", "webp" ],
			imageUploadURL : "${proPath }/tool/upFile", //注意你后端的上传图片服务地址
		});
	});
	$('.btn-blog-save').click(function() {
		$("#formBlog")[0].reset();
		$("#blog_title").val($("#art-head").val());
		$("#blog_md").val(md_edit.getMarkdown());
		$("#blog_html").val(md_edit.getHTML());
		$("#formBlog").ajaxSubmit({
			success : function(da) {
				console.log(da);
				$.scojs_message('发布成功', $.scojs_message.TYPE_OK);
				
				<%-- <%
				response.getWriter().write("恭喜您激活成功,3秒后回到主页....");
				String url = request.getContextPath() + "/bolg/list/1";
				response.setHeader("Refresh", "3;url=" + url);
				%> --%>
			}
		});
	});
</script>

</html>